{extend name="public:jrgbase" /}
{block name="header"}
{include file="public/jrgtop-nav" /}
{/block}
{block name="content"}
    <script src="__PUBLIC__/jquery-weui/dist/js/jquery-weui.js"></script>
    <div class="weui-tab__panel" id= "weui-tab__panel" style="background: #fff">
        <div class="pro-list-container"  id="pro-list-container">
            <!--搜索-->
            <!--<div class="search">
                <input type="text" /> <a href="javascript:;">搜索</a>
            </div>-->
            {include file="public/search" /}
            <div class="category-page-content ">
                <!--分类-->
                <div class="category-box">
                    <div class="category" id="category">
                        {volist name="category" id="vo"}
                        <a href="javascript:;" data-catid="{$vo.id}" class="viewCatTopItem">{$vo.name}</a>
                        {/volist}
                    </div>
                </div>
                <!--商品-->
                <ul id="fir">
                </ul>
                <div class="clear"></div>
            </div>
        </div>
    </div>
    <script>
        document.getElementById("weui-tab__panel").addEventListener("scroll", function (ev) {
            var scrollTop = document.getElementById("weui-tab__panel").scrollTop;
            var category = document.getElementById("category");
            if(scrollTop > 78 ) {
                category.classList.add("category-fixed")
            } else {
                category.classList.remove("category-fixed")
            }
        });
    </script>
    <script>
        $(function () {
            // 默认load第一个分类的列表
            var vie = $('.viewCatTopItem');
            vie.eq(0).addClass('active');
            getGoods(vie.attr('data-catid'));
        });

        // 左侧按钮点击
        $('.viewCatTopItem').click(function () {
            var id = $(this).attr('data-catid');
            $('.viewCatTopItem.active').removeClass('active');
            $(this).addClass('active');

            getGoods(id);
        });
        function getGoods(id){
            $.ajax({
                url : "get_goods",
                data : {id:id},
                type : 'post',
                success : function(d){
                    var url = '';
                    if (id == 1069){
                        url = '/mobile/goods/detail2?id=';
                    }else{
                        url = '/mobile/goods/detail?id=';
                    }
                    $('#fir li').remove();
                    for(var i=0;i<d.length;i++){
                        $('#fir').append(
                            "<li> "+
                            "<a href='"+url+""+ d[i].goods_id +"'>"+
                            "<img class='pro-img' src='"+ d[i].image +"' > "+
                            "<p class='title'>"+ d[i].name +"</p>"+
                            "<p class='price'>元宝："+ d[i].price +
                            "<span class='shopping-car'></span>" +
                            " </p> " +
                            "</a> " +
                            "</li>"
                        );
                    }
                }
            });
        }
    </script>
{/block}
{/block}
